/**
 * @parma author ludan
 * @param explain 网盘查询信息
 */
import React from 'react'
import { Observer } from 'mobx-react-lite'
import NetworkHeader from '@/pages/Netdisk/NetworkHeader'
import SearchBox from '@/components/SearchBox'
import { baseInputListType } from '@/components/SearchBox'
import NetworkTable from '@/components/NetworkTable'

export interface baseQueryInfoType {
  [key: string]: any;
}

const NetworkQueryInfo: React.FC = (props: baseQueryInfoType) => {
  const inputList: baseInputListType[] = [
    {
      inputType: 'input',
      inputItemInfo: {
        name: 'name',
        label: '姓名',
        rules: [{ required: true, message: '请输入用户名称' }],
        placeholder: '请输入用户名称',
      }
    },
    {
      inputType: 'input',
      inputItemInfo: {
        name: 'age',
        label: '年龄',
        rules: [{ required: true, message: '请输入用户年龄' }],
        placeholder: '请输入用户年龄',
      }
    },
    {
      inputType: 'select',
      inputItemInfo: {
        name: 'select1',
        label: '是否看完',
        rules: [{ required: true, message: '请选择查看完成情况' }],
        placeholder: '请选择查看完成情况',
        option: [
          { value: "0", nameValue: "查看完成" },
          { value: "1", nameValue: "查看一部分，未查看完" },
          { value: "2", nameValue: "未查看完成" }
        ]
      }
    }
  ]

  return (
    <Observer>
      {() => (
        <div>
          <NetworkHeader>网盘查询信息</NetworkHeader>
          <SearchBox
            inputList={inputList}
            layout="horizontal"
            labelCol={{ span: 4 }}
            wrapperCol={{ span: 16 }}
            initItem={{}}
          />
          <NetworkTable scroll={{ y: 300 }} />
        </div>
      )}
    </Observer>
  )
}

export default NetworkQueryInfo;